<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>搜索结果</title>
    <link rel="shortcut icon" href="{{ url_for('static', filename='img/smallPicture.ico') }}"/>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/resultPage.css') }}" type="text/css"/>
</head>
<body>
	<div id="searchDiv">
        <form action="http://localhost:5000/search" method='post' name="searchInputName">
            <label>
                <input type="text" placeholder="搜索" class="searchInput" name="search">
            </label>
            <!-- <input type="button" name="formButton"class="searchButton"/> -->
        </form>
    </div>
    {% for data in datas %}
    	<div class="searchInfo">
    		<!-- 这里还可以加个判断 -->
            <a href="{{ data.url }}" target="_blank">{{ data.title }}</a>
    		<div>
    			<p>{{ data.content }}</p>
    		</div>
    	</div>
    {% endfor %}
    <!-- 新添加的数据添加到下面div dom树的形式添加 -->
    <div id="new">
        <div id="replace">
        </div>
    </div>
    <script>
        document.getElementsByClassName('searchInput')[0].value = "{{ searchStr }}";
        <!-- 获取滚动条高度 -->
        function getScrollTop() {
            var scroll_top = 0;
            if (document.documentElement && document.documentElement.scrollTop) {
                scroll_top = document.documentElement.scrollTop;
            }
            else if (document.body) {
                scroll_top = document.body.scrollTop;
            }
            return scroll_top;
        }
        <!-- get请求获取局部加载的数据 -->
        function loadXMLDoc(url)
        {
            var xmlhttp;
            if (window.XMLHttpRequest)
            {
                //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
                xmlhttp=new XMLHttpRequest();
            }
            else
            {
                // IE6, IE5 浏览器执行代码
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange=function()
            {
                if (xmlhttp.readyState === 4 && xmlhttp.status===200)
                {
                    var refNode = document.getElementById("replace");
                    var newNode = refNode.parentNode;  <!-- 找到父节点 -->
                    newNode.innerHTML = xmlhttp.responseText;  <!-- 替换父节点的内容 -->
                }
            };
            xmlhttp.open("GET",url,true);
            xmlhttp.send();
        }
        var next = 1;
        function loopcheck() {
            var scrollTop = getScrollTop();
            var scrollHeight = document.documentElement.scrollHeight;
            if (scrollHeight - scrollTop < 1000) {
                next = next + 1;
                url = "http://localhost:5000/search/{{ searchStr }}/" + next;
                loadXMLDoc(url)
            }
        }
        var loop = window.setInterval(loopcheck, 1000);

    </script>
</body>
</html>
